import 'package:enterprise_v6_app/app/components/custom_app_bar.dart';
import 'package:enterprise_v6_app/app/core/ext/ext.dart';
import 'package:enterprise_v6_app/app/core/values/dimens.dart';
import 'package:enterprise_v6_app/app/core/values/gaps.dart';
import 'package:enterprise_v6_app/app/core/values/images.dart';
import 'package:enterprise_v6_app/app/modules/application/double_prevention_page/risk_control_page/task_implementation_page/task_practicable/ledger_detail_page/ledger_detail_page_controller.dart';
import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:flutter_svg/svg.dart';
import 'package:get/get.dart';

///台账详情
class LedgerDetailPage extends StatelessWidget {
  LedgerDetailPage({super.key});

  final controller = Get.put(LedgerDetailPageController());

  /// 获取台账基础信息视图
  Widget _getBasicInformation() {
    return Container(
      height: 140.w,
      width: AppDimens.sh,
      padding: EdgeInsets.symmetric(horizontal: 16.w, vertical: 16.w),
      color: const Color(0xFF5C6DFF),
      child: Column(
        children: [
          Row(
            children: [
              SvgPicture.asset(
                AppImages.icon_ledger_icon,
                width: 17.w,
                height: 17.w,
              ),
              AppGaps.hGap6,
              Expanded(
                  child: Text(
                '检查压力表读数是...',
                style: TextStyle(
                  fontSize: 16.sp,
                  color: Colors.white,
                  overflow: TextOverflow.ellipsis,
                  fontWeight: FontWeight.w500,
                ),
              )),
              _title('已落实', const Color(0xFFFFFFFF))
            ],
          ),
          AppGaps.vGap4,
          Row(
            children: [
              Text(
                '日常巡检',
                style: TextStyle(
                  overflow: TextOverflow.ellipsis,
                  fontSize: 13.sp,
                  color: Colors.white,
                  fontWeight: FontWeight.w400,
                ),
              ),
              Text(
                ' · ',
                style: TextStyle(
                  overflow: TextOverflow.ellipsis,
                  fontSize: 24.sp,
                  color: Colors.white,
                  fontWeight: FontWeight.w400,
                ),
              ),
              Text(
                '1/时',
                style: TextStyle(
                  overflow: TextOverflow.ellipsis,
                  fontSize: 13.sp,
                  color: Colors.white,
                  fontWeight: FontWeight.w400,
                ),
              ),
              Text(
                ' · ',
                style: TextStyle(
                  overflow: TextOverflow.ellipsis,
                  fontSize: 24.sp,
                  color: Colors.white,
                  fontWeight: FontWeight.w400,
                ),
              ),
              Text(
                '00:00-12:00',
                style: TextStyle(
                  overflow: TextOverflow.ellipsis,
                  fontSize: 13.sp,
                  color: Colors.white,
                  fontWeight: FontWeight.w400,
                ),
              ),
            ],
          )
        ],
      ),
    );
  }

  Widget _title(String title, Color color) {
    return Container(
      padding: EdgeInsets.symmetric(vertical: 2.w, horizontal: 11.w),
      decoration: BoxDecoration(
          color: color,
          borderRadius: const BorderRadius.only(
            topLeft: Radius.circular(10),
            topRight: Radius.circular(10),
            bottomRight: Radius.circular(10),
          )),
      child: Text(
        title,
        style: TextStyle(
          color: const Color(0xFF5C6DFF),
          fontSize: 10.sp,
          fontWeight: FontWeight.w400,
        ),
      ),
    );
  }

  /// 获取展开按钮
  Widget _getExpandButton() {
    return Row(
      children: [
        Text(
          '展开',
          style: TextStyle(
            fontSize: 14.sp,
            color: Colors.white,
            fontWeight: FontWeight.w400,
          ),
        ),
        AppGaps.hGap6,
        SvgPicture.asset(
          AppImages.icon_circle_down,
          width: 16.w,
          height: 16.w,
        )
      ],
    ).clickOnce(() {});
  }

  Widget _getDetailsView() {
    return Container(
      alignment: Alignment.center,
      padding: EdgeInsets.symmetric(horizontal: 12.w, vertical: 20.w),
      decoration: BoxDecoration(
        color: Colors.white,
        borderRadius: BorderRadius.all(
          Radius.circular(6.w),
        ),
      ),
      child: Row(
        mainAxisAlignment: MainAxisAlignment.spaceAround,
        children: [
          _topTitle('正常', const Color(0xFF5C6DFF), '20'),
          _divider(),
          _topTitle('逾期补检', const Color(0xFFFC9900), '20'),
          _divider(),
          _topTitle('漏检', const Color(0xFFFD6B6B), '20'),
        ],
      ),
    );
  }

  /// 字段显示
  Widget _getFieldView(String title, String value) {
    return Expanded(
      child: Row(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          Text(
            title,
            style: TextStyle(
              fontSize: 13.sp,
              height: 1.2,
              color: const Color(0xFFA5A6B5),
              fontWeight: FontWeight.w400,
            ),
          ),
          Expanded(
              child: Text(
            value,
            style: TextStyle(
              fontSize: 13.sp,
              height: 1.2,
              color: const Color(0xFF495061),
              fontWeight: FontWeight.w400,
            ),
          ))
        ],
      ),
    );
  }

  Widget _geBottomView() {
    return Container(
      padding: EdgeInsets.symmetric(horizontal: 20.w, vertical: 20.w),
      decoration: BoxDecoration(
        color: Colors.white,
        borderRadius: BorderRadius.all(
          Radius.circular(6.w),
        ),
      ),
      child: Column(
        children: [
          Container(
            alignment: Alignment.center,
            padding: EdgeInsets.symmetric(vertical: 10.w),
            decoration: BoxDecoration(
              color: const Color(0xFFF1F2F7),
              borderRadius: BorderRadius.all(
                Radius.circular(6.w),
              ),
            ),
            child: Row(
              children: [
                Expanded( flex: 1,child: Center(child: Text('时间',style: TextStyle(fontWeight: FontWeight.w500,fontSize: 12.sp,color: const Color(0xFF495061))))),
                Expanded( flex: 1,child: Center(child: Text('状态',style: TextStyle(fontWeight: FontWeight.w500,fontSize: 12.sp,color: const Color(0xFF495061))))),
                Expanded( flex: 1,child: Center(child: Text('部门/人员',style: TextStyle(fontWeight: FontWeight.w500,fontSize: 12.sp,color: const Color(0xFF495061))))),
              ],
            ),
          ),
          Expanded(
              child: ListView.separated(
                  itemBuilder: (context, index) {
                    return index % 2 != 0? Container(
                      alignment: Alignment.center,
                      padding: EdgeInsets.symmetric(vertical: 10.w),
                      decoration: BoxDecoration(
                        color: const Color(0xFFF1F2F7),
                        borderRadius: BorderRadius.all(
                          Radius.circular(6.w),
                        ),
                      ),
                      child: Row(
                        mainAxisAlignment: MainAxisAlignment.spaceAround,
                        crossAxisAlignment: CrossAxisAlignment.center,
                        children: [
                          Expanded( flex: 1,child: Center(child: Text('00:00-12:00',style: TextStyle(fontWeight: FontWeight.w400,fontSize: 12.sp,color: const Color(0xFF818499))))),
                          Expanded( flex: 1,child: Center(child: Text( index % 2 != 0? '正常':'逾期',style: TextStyle(fontWeight: FontWeight.w400,fontSize: 12.sp,color: index % 2 != 0? const Color(0xFF5C6DFF):const Color(0xFFFD6B6B))))),
                          Expanded( flex: 1,child: Center(child: Text('XXXX部门',style: TextStyle(fontWeight: FontWeight.w400,fontSize: 12.sp,color: const Color(0xFF818499))))),
                        ],
                      ),
                    ):Container(
                      alignment: Alignment.center,
                      padding: EdgeInsets.symmetric(vertical: 10.w),
                      decoration: BoxDecoration(
                        color:  Colors.white,
                        borderRadius: BorderRadius.all(
                          Radius.circular(6.w),
                        ),
                      ),
                      child: Row(
                        mainAxisAlignment: MainAxisAlignment.spaceAround,
                        crossAxisAlignment: CrossAxisAlignment.center,
                        children: [
                          Expanded( flex: 1,child: Center(child: Text('00:00-12:00',style: TextStyle(fontWeight: FontWeight.w400,fontSize: 12.sp,color: const Color(0xFF818499))))),
                          Expanded( flex: 1,child: Center(child: Text( index % 2 != 0? '正常':'逾期',style: TextStyle(fontWeight: FontWeight.w400,fontSize: 12.sp,color: index % 2 != 0? const Color(0xFF5C6DFF):const Color(0xFFFD6B6B))))),
                          Expanded( flex: 1,child: Center(child: Text('XXXX部门',style: TextStyle(fontWeight: FontWeight.w400,fontSize: 12.sp,color: const Color(0xFF818499))))),
                        ],
                      ),
                    );
                  },
                  separatorBuilder: (context, index) =>const SizedBox(width: 0, height: 0),
                  itemCount: 10))
        ],
      ),
    );
  }

  @override
  Widget build(BuildContext context) {
    return GetBuilder(
        init: controller,
        builder: (_) {
          return Scaffold(
            appBar: CustomAppBar(
              title: Text(
                '台账详情',
                style: TextStyle(
                  fontSize: 18.sp,
                  color: Colors.white,
                  fontWeight: FontWeight.w400,
                ),
              ),
              leading: const BackButton(
                color: Colors.white,
              ),
              iconButtonColor: Colors.white,
              backgroundColor: const Color(0xFF5C6DFF),
            ),
            body: Container(
                color: const Color(0xFFF5F5F6),
                child: Stack(
                  children: [
                    //台账基础信息
                    _getBasicInformation(),
                    Container(
                      margin: EdgeInsets.only(top: 90.w),
                      padding: EdgeInsets.symmetric(horizontal: 16.w),
                      child: Column(
                        children: [
                          _getDetailsView(),
                          AppGaps.vGap14,
                          Expanded(child: _geBottomView()),
                          AppGaps.vGap20
                        ],
                      ),
                    )
                  ],
                )),
          );
        });
  }

  // 落实
  Widget _topTitle(String title, Color color, String? value) {
    return Column(
      crossAxisAlignment: CrossAxisAlignment.start,
      mainAxisAlignment: MainAxisAlignment.start,
      children: [
        Text(
          value ?? '空',
          style: TextStyle(
            fontSize: 16.sp,
            color: color,
            fontWeight: FontWeight.w400,
          ),
        ),
        AppGaps.vGap2,
        Text(
          title,
          style: TextStyle(
            fontSize: 11.sp,
            color: const Color(0xFF4D4E6C),
            height: 1.2,
            fontWeight: FontWeight.w500,
          ),
        ),
      ],
    );
  }

  ///分割线
  Widget _divider() {
    return Container(
      width: 1.w,
      height: 17.w,
      decoration: const BoxDecoration(
          gradient: LinearGradient(begin: Alignment.topCenter, end: Alignment.bottomCenter, colors: [
        Color(0x00649FFF),
        Color(0xFF649FFF),
        Color(0x00649FFF),
      ])),
    );
  }
}
